<template>
  <div id="index">
    <manageHead class="topbar"></manageHead>
    <section class="container">
      <div>
        <manageLeft></manageLeft>
      </div>
      <div class="main_wrapper">
        <manageNavigator class="nav"></manageNavigator>
        <router-view></router-view>
      </div>
    </section>
  </div>
</template>

<script>


import manageHead from "@/components/common/manageHead";
import manageLeft from "@/components/common/manageLeft";
import manageNavigator from "@/components/common/manageNavigator";

export default {
  // eslint-disable-next-line vue/multi-word-component-names
  name: "index",
  components: {manageHead,manageLeft,manageNavigator},
  setup(){

  }
}
</script>

<style scoped>
#index .nav {
  box-shadow: 1px 0 5px rgba(0, 0, 0, 0.1);
  margin-bottom: 30px;
}
.container {
  display: flex;
  width: auto;
  margin-left: -20px;
  background-color: #fff;
}
.main_wrapper {
  overflow: hidden;
  flex: 1;
  background-color: #fff;
}
</style>